ViewPager এবং TabLayout ব্যবহার

Mobile App Development - অ্যান্ড্রয়েড ডেভেলপমেন্ট (Android) - Activity এবং Fragment Lifecycle
256

ViewPager এবং TabLayout ব্যবহার

Android অ্যাপ্লিকেশনে ViewPager এবং TabLayout ব্যবহার করে ব্যবহারকারীর জন্য স্ক্রোলযোগ্য বা স্লাইডযোগ্য ট্যাব এবং পেজ তৈরির জন্য অত্যন্ত কার্যকরী। এটি সাধারণত একটি অ্যানিমেটেড এবং ইন্টারঅ্যাকটিভ UI তৈরি করতে ব্যবহৃত হয়, যেখানে ব্যবহারকারী ট্যাবের মধ্যে সোয়াইপ বা ক্লিক করে বিভিন্ন স্ক্রিন বা কন্টেন্ট দেখতে পারেন।

নিচে ViewPager এবং TabLayout এর ব্যবহার নিয়ে বিস্তারিত আলোচনা এবং উদাহরণ দেওয়া হলো।


১. ViewPager

ViewPager হল একটি Android উপাদান, যা ব্যবহারকারীদের স্ক্রোল বা সোয়াইপ করে বিভিন্ন পেজের মধ্যে নেভিগেট করতে দেয়। এটি একাধিক Fragment বা ভিউ পেজ নিয়ে কাজ করতে পারে, এবং প্রতিটি Fragment আলাদা কন্টেন্ট প্রদর্শন করতে পারে। ViewPager সাধারণত FragmentPagerAdapter বা FragmentStatePagerAdapter ব্যবহার করে পেজ ম্যানেজ করে।

ViewPager সেটআপ:

ধাপ ১: XML ফাইলে ViewPager যোগ করা

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

ধাপ ২: Fragment তৈরি করা

প্রথমে বিভিন্ন Fragment তৈরি করুন, যেমন FirstFragment, SecondFragment, এবং ThirdFragment

FirstFragment.java:

public class FirstFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment_first, container, false);
    }
}

ধাপ ৩: ViewPager Adapter তৈরি করা

ViewPagerAdapter.java:

public class ViewPagerAdapter extends FragmentPagerAdapter {
    public ViewPagerAdapter(@NonNull FragmentManager fm) {
        super(fm);
    }

    @NonNull
    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0:
                return new FirstFragment();
            case 1:
                return new SecondFragment();
            case 2:
                return new ThirdFragment();
            default:
                return new FirstFragment();
        }
    }

    @Override
    public int getCount() {
        return 3; // Total number of pages
    }
}

ধাপ ৪: MainActivity এ ViewPager সেট করা

public class MainActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private ViewPagerAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        viewPager = findViewById(R.id.viewPager);
        adapter = new ViewPagerAdapter(getSupportFragmentManager());
        viewPager.setAdapter(adapter);
    }
}

২. TabLayout

TabLayout হল একটি Material Design কম্পোনেন্ট, যা ট্যাবের মাধ্যমে বিভিন্ন পেজের মধ্যে নেভিগেশন করতে সাহায্য করে। এটি সাধারণত ViewPager এর সাথে যুক্ত করা হয়, যাতে ViewPager এর পেজ পরিবর্তন হলে ট্যাবও পরিবর্তিত হয়।

TabLayout সেটআপ:

ধাপ ১: XML ফাইলে TabLayout এবং ViewPager যোগ করা

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="fixed"
        app:tabGravity="fill"/>

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

ধাপ ২: MainActivity এ TabLayout এবং ViewPager সংযুক্ত করা

public class MainActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private ViewPagerAdapter adapter;
    private TabLayout tabLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        viewPager = findViewById(R.id.viewPager);
        tabLayout = findViewById(R.id.tabLayout);

        adapter = new ViewPagerAdapter(getSupportFragmentManager());
        viewPager.setAdapter(adapter);

        // TabLayout সংযুক্ত করা
        tabLayout.setupWithViewPager(viewPager);

        // ট্যাবের নাম সেট করা
        tabLayout.getTabAt(0).setText("Tab 1");
        tabLayout.getTabAt(1).setText("Tab 2");
        tabLayout.getTabAt(2).setText("Tab 3");
    }
}

সংক্ষিপ্ত ব্যাখ্যা:

  • ViewPager এবং TabLayout একত্রে ব্যবহার করে একটি স্ক্রোলযোগ্য বা সোয়াইপযোগ্য UI তৈরি করা হয়।
  • setupWithViewPager() মেথডের মাধ্যমে TabLayout এবং ViewPager সংযুক্ত করা হয়, যাতে ব্যবহারকারী ট্যাব ক্লিক করলে পেজ পরিবর্তিত হয় এবং সোয়াইপ করলে ট্যাবও পরিবর্তিত হয়।

৩. TabLayout এবং ViewPager এর বৈশিষ্ট্য

বৈশিষ্ট্যTabLayoutViewPager
ব্যবহারট্যাবের মাধ্যমে নেভিগেশন করাসোয়াইপ করে পেজ পরিবর্তন করা
Interactionব্যবহারকারী ট্যাবে ক্লিক করতে পারেব্যবহারকারী পেজ সোয়াইপ করতে পারে
DesignMaterial Design স্টাইল অনুযায়ীঅ্যানিমেশন এবং ফ্লুইড ইন্টারফেস
Adapterসরাসরি কোন অ্যাডাপ্টার নেইFragmentPagerAdapter বা FragmentStatePagerAdapter প্রয়োজন

উপসংহার

ViewPager এবং TabLayout Android অ্যাপ্লিকেশনে স্ক্রোলযোগ্য এবং সোয়াইপযোগ্য UI তৈরি করার জন্য খুবই গুরুত্বপূর্ণ উপাদান। ViewPager ব্যবহার করে আপনি একাধিক পেজ তৈরি করে সোয়াইপ করার সুবিধা প্রদান করতে পারেন, এবং TabLayout ব্যবহার করে ট্যাব ভিত্তিক নেভিগেশন তৈরি করতে পারেন। এই উপাদানগুলোর সঠিক ব্যবহার অ্যাপ্লিকেশনের ইন্টারফেসকে আরও ইন্টারঅ্যাকটিভ এবং ব্যবহারবান্ধব করে তোলে।

Content added By
Promotion
NEW SATT AI এখন আপনাকে সাহায্য করতে পারে।

Are you sure to start over?

Loading...